<header>
  <nav class="bar clrBr clrP navBar">
    <div class="flexVCent">
      <div class="windowControlsHolder">
        <div class="windowControls">
          <a class="winControl navClose js-navClose">
            <i class="ion-ios-close-empty"></i>
          </a>
          <a class="winControl navMin js-navMin">
            <i class="ion-ios-minus-empty"></i>
          </a>
          <a class="winControl navMax js-navMax">
            <i class="ion-ios-plus-empty"></i>
          </a>
        </div>
      </div>
      <div>
        <div class="flexVCent iconPad">
          <a class="iconBtn js-navBack toolTipNoWrap" data-tip="<%= ob.polyT('pageNav.toolTip.back') %>">
            <i class="ion-chevron-left"></i>
          </a>
          <a class="iconBtn js-navFwd toolTipNoWrap" data-tip="<%= ob.polyT('pageNav.toolTip.forward') %>">
            <i class="ion-chevron-right"></i>
          </a>
          <a class="iconBtn js-navReload toolTipNoWrap" data-tip="<%= ob.polyT('pageNav.toolTip.refresh') %>"  id="Nav_Refresh">
            <i class="ion-refresh"></i>
          </a>
        </div>
      </div>
      <div class="rowDivV clrBrBk"></div>
      <div class="pageNavCenter">
        <div class="flexVCent gutterHSm">
          <div class="searchWrapper">
            <input type="text" class="js-addressBar flexExpand addressBar clrSh2 clrBr4"
                   placeholder="<%= ob.polyT('addressBarPlaceholder') %>" value="<%= ob.addressBarText %>" />
            <div class="js-addressBarIndicatorsContainer"></div>
          </div>
          <% if (ob.testnet) { %>
            <div id="testnetFlag" class="btn barBtn normalBtn clrP clrBr" >
                <span class="toolTip" data-tip="<%= ob.polyT('testnetTooltip') %>"><%= ob.polyT('testnet') %></span>
            </div>
          <% } %>
        </div>
      </div>
      <div class="rowDivV clrBrBk"></div>
      <div>
        <div class="flexVCent box margLSm posR">
          <a href="#search" class="toolTipNoWrap js-discover" data-tip="<%= ob.polyT('pageNav.toolTip.discover') %>" id="Nav_Discover">
            <div class="discoverBtn navBtn" style="background-image: url('../imgs/obVectorIconSmall.svg')"></div>
          </a>
          <% if (ob.showDiscoverCallout) { %>
            <div class="discoverCallout js-discoverCallout arrowBoxTop confirmBox clrP clrSh1 clrBr">
              <div class="tx3 txB rowSm"><%= ob.polyT('pageNav.discoverCalloutTitle') %></div>
              <p><%= ob.polyT('pageNav.discoverCalloutBody') %></p>
            </div>
          <% } %>
          <a class="navBtn toolTipNoWrap js-navWalletBtn" data-tip="<%= ob.polyT('pageNav.toolTip.wallet') %>" id="Nav_Wallet">
            <div class="iconBtn navWalletBtn "><%= ob.walletIconTmpl() %></div>
          </a>
          <a class="navBtn toolTipNoWrap js-navNotifBtn" data-tip="<%= ob.polyT('pageNav.toolTip.notifications') %>" id="Nav_Notifications">
            <i class="iconBtn ion-android-notifications"></i>
            <div class="discTn notifUnreadBadge js-notifUnreadBadge clrE1 clrTOnEmph clrBr2 clrSh2 hide"></div>
          </a>
          <div class="js-notifContainer notifContainer foldDown"></div>
          <a id="AvatarBtn" class="discSm clrBr2 clrSh1 js-navListBtn navListBtn toolTipNoWrap" style="<%= ob.getAvatarBgImage(ob.avatarHashes) %>" data-tip="<%= ob.polyT('pageNav.toolTip.nav') %>"></a>
          <nav class="navListWrapper foldDown js-navList">
            <div class="navList clrBr listBox clrP clrSh1">
              <div class="listGroup clrP clrBr">
                <a class="listItem js-navListItem" href="#<%= ob.peerID %>/home">
				          <span class="txB tx4 noOverflow"><%= ob.name %></span>
			        	</a>
              </div>
              <div class="listGroup clrP clrBr">
                <a class="listItem connectedServerListItem js-connectedServerListItem">
                  <span class="noOverflow js-connectedServerName <% if (ob.connectedServer) print('txB') %>"><% print(ob.connectedServer ? ob.connectedServer.name : ob.polyT('pageNav.notConnectedMenuItem')) %></span>
                  <span><i class="ion-arrow-right-b floR"></i></span>
                </a>
              </div>
              <div class="listGroup clrP clrBr">
                <a class="listItem js-navListItem" href="#<%= ob.peerID ? `${ob.peerID}` : ''%>">
                  <span><%= ob.polyT('pageNav.myPage') %></span><span class="clrT2 TODO">Cltrl + ?</span>
                </a>
                <a class="listItem js-navListItem TODO"><!--TODO add route for Page Customization-->
                  <span><%= ob.polyT('pageNav.customizePage') %></span><span class="clrT2 TODO">Cltrl + ?</span>
                </a>
                <a class="listItem js-navCreateListing js-navListItem">
                  <span><%= ob.polyT('pageNav.createListing') %></span><span class="clrT2 TODO">Cltrl + ?</span>
                </a>
              </div>
              <div class="listGroup clrP clrBr">
                <a href="#transactions/sales" class="listItem js-navListItem">
                  <span><%= ob.polyT('pageNav.sales') %></span><span class="clrT2 TODO">Cltrl + ?</span>
                </a>
                <a href="#transactions/purchases" class="listItem js-navListItem">
                  <span><%= ob.polyT('pageNav.purchases') %></span><span class="clrT2 TODO">Cltrl + ?</span>
                </a>
                <a href="#transactions/cases" class="listItem js-navListItem">
                  <span><%= ob.polyT('pageNav.cases') %></span><span class="clrT2 TODO">Cltrl + ?</span>
                </a>
              </div>
              <div class="listGroup clrP clrBr">
                <a class="listItem js-navSettings js-navListItem">
                  <span><%= ob.polyT('pageNav.settings') %></span><span class="clrT2 TODO">Cltrl + ?</span>
                </a>
                <a class="listItem js-navHelp js-navListItem">
                  <span><%= ob.polyT('pageNav.help') %></span><span class="clrT2 TODO">Cltrl + ?</span>
                </a>
              </div>
              <div class="listGroup clrP clrBr">
                <a class="listItem js-navAboutModal">
                  <span><%= ob.polyT( 'about.linkText' ) %></span>
                </a>
              </div>
            </div>
          </nav>
          <nav class="connManagementContainer foldDown clrSh1 js-connManagementContainer"></nav>
        </div>
      </div>
    </div>
  </nav>
</header>
<div class="navOverlay modal js-navOverlay"></div>
